<?php
use yii\helpers\Html;
use yii\helpers\Url;
use app\lib\WeixinUtils;

/* @var $this yii\web\View */
/* @var $content string 字符串 */


$web = Url::to("@web");

?>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">

    <link type="text/css" href="<?= $web ?>/css/swiper.min.css" rel="stylesheet">
    <link rel="stylesheet" href="<?= $web ?>/css/wx/new_chose_card.css"/>
    <script src="<?= $web ?>/js/jquery.js"></script>
    <script type="text/javascript" src="<?= $web ?>/js/swiper.min.js"></script>
    <script type="text/javascript" src="<?= $web ?>/js/jquery.lazyload.min.js"></script>
    <title>挑选礼物</title>
    <script type="text/javascript">

        function href_card_list(id) {
            //alert(id);
            id = encodeURI(id);
            window.location.href = "<?=Url::to(["wx-biz/card-detail"]);?>?id=" + id;
        }

        function t() {
            window.location.href = "<?=Url::to(["wx-biz/card-detail"]);?>";
        }

        function link_full(href) {
            window.location.href = href;
        }

        $(document).ready(function () {
//           alert($(window).height()+"--"+$(window).width());
            var docWidth = $(document).width();
            if (docWidth > 640) {
                docWidth = 640;
            }
            $("html").css("font-size", docWidth * 20 / 320);

            var swiper = new Swiper('.swiper-container', {
                pagination: '.swiper-pagination',
                initialSlide: 0,
                slidesPerView: 1,
                paginationClickable: true,
                spaceBetween: 0,
                autoplay: 3000
            });
        });
    </script>
</head>
<body>

<div class="main">
    <!--banner-->
    <div class="swiper-container" style="height: 8.3rem;">
        <div class="swiper-wrapper">
            <?php
            foreach ($banners as $banner) {
                ?>
                <div class="swiper-slide">
                    <img src="<?= $banner['IMGURL'] ?>"
                         onclick="link_full('<?= $banner['ADDURL'] ?>')" style="width: 16rem; height: 8.3rem;">
                </div>
                <?php
            }
            ?>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>
    <ul style="width: 100%;">
        <?php
        for ($i = 0; $i < sizeof($cards); $i++) {
            $card = $cards[$i];
            ?>
            <li style="width: 100%; height: 100%;">
                <div href="#" onclick="href_card_list('<?= $card['ID'] ?>')" class="card-frame"
                     style="background-image: url('<?= $card['CARD_ONE'] ?>')">
                    <div class="card-info-frame">
                        <div class="bg"></div>
                        <div style="color: #ffffff; position: absolute; top: 0.65rem; right: 0.55rem;">
                            <div class="txt-name">
                                <div><?= $card['NAME'] ?></div>
                            </div>
                            <div style="float: right; margin-top: 0.35rem;">
                                <div style="float: right; height: 1.5rem;  position: relative;">
                                    <span style="font-size: 1.3rem;"><?= floatval($card['PRICE']) ?></span>
                                </div>
                                <div style="float: right; height: 1.5rem; position: relative;">
                                    <span style="font-size: 0.5rem;">￥</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div style="position: relative; top: 3.8rem; margin-left:0.5rem; color:#ffffff;"><span style="font-size:0.5rem;">有效期：<?= $card['VALID_DATE_MESSAGE'] ?></span>
                    </div>
                </div>
                <div class="card-spliter"></div>
            </li>
            <?php
        }
        ?>
    </ul>
</div>

</body>
</html>

